/*
 Theme Name:   Bricks Child Theme
 Theme URI:    https://bricksbuilder.io/
 Description:  Use this child theme to extend Bricks.
 Author:       Bricks
 Author URI:   https://bricksbuilder.io/
 Template:     bricks
 Version:      1.1
 Text Domain:  bricks
*/

@media only screen and (min-width: 1590px) {
    html {
        font-size: 1vw !important;
    }
}


footer {
    position: relative;
    isolation: isolate;
}



section {
    background-color: var(--eggshell);
    position: relative;
    isolation: isolate;
    z-index: 5;
}

header.hide,
header.anchor-scrolling,
.page.home header.sticky:not(.scrolling) {
    overflow-x: hidden;
    scrollbar-width: none;
}

header>div {
    transition: transform var(--t-base), background-color var(--t-base), box-shadow var(--t-base) !important;
}

header:has(.is-active) {
    overflow: visible !important;
}

header.scrolling>div {
    background-color: var(--white);
}

header:not(.scrolling)>div {
    background-color: transparent !important;
}

header .header-logo {
    transition: opacity var(--t-base);
}

header:has(.is-active) .header-logo {
    opacity: 1;
}


header:has(.brx-open)>div {
    background-color: var(--white) !important;
}

header.scrolling>div {
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

#brx-header.sticky {
    transition: transform var(--t-base);
}

body .brxe-popup-2107 {
    opacity: 1 !important;
    pointer-events: all !important;
    visibility: hidden;
}

.brxe-popup-2107 .brx-popup-content {
    transform: translateX(100%);
}

.brx-popup .brx-popup-backdrop {
    transition: none;
}


#main-wrapper {
    z-index: 2;
}

main {
    background-color: var(--eggshell);
}

@media screen and (max-width: 767px) {
    footer {
        height: auto !important;
    }

}

/*HEADER*/

.header-logo path {
    transition: fill var(--t-base);
}

header:not(.scrolling):not(:has(.brx-open)) [data-light-nav="1"] .header-logo path {
    fill: white;
}


header nav :is(.brxe-text-link, .language-switcher) {
    transition: color var(--t-base);
}

header:not(.scrolling):not(:has(.brx-open)) [data-light-nav="1"] :is(.brxe-text-link, .language-switcher) {
    color: white;
}

header:not(.scrolling):not(:has(.brx-open)) [data-light-nav="1"] :is(.brxa-inner, .brxe-inner:after, .brxe-inner:before) {
    background-color: white;
    color: white;
}


/*Page transitions*/
@view-transition {
    navigation: auto;
}

img[data-lazyloaded] {
    opacity: 0;
}

/* PART 2 - Upon Lazy Load */
img.litespeed-loaded {
    -webkit-transition: opacity .5s linear 0.2s;
    -moz-transition: opacity .5s linear 0.2s;
    transition: opacity .5s linear 0.2s;
    opacity: 1;
}